<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<!-- <link rel="stylesheet" type="text/css" href="fonts/font-awesome-4.7.0/css/font-awesome.min.css">
		<link rel="stylesheet" type="text/css" href="fonts/iconic/css/material-design-iconic-font.min.css">
		<link rel="stylesheet" type="text/css" href="css/util.css"> -->
		<link rel="stylesheet" type="text/css" href="css/main.css">
		<style type="text/css">
			#cont{
				margin-top: 50px;
			}
			.mui-input-row>label{
				font-size: 16px;
			}
			.mui-input-row>input{
				font-size: 16px;
				display: block;
			}
			#textarea{
				text-align: left;
			}
			.textarea label{
				font-size: 16px;
				margin-left: 14px;
			}
			/* button */
			.container-login100-form-btn {
			  display: -webkit-box;
			  display: -webkit-flex;
			  display: -moz-box;
			  display: -ms-flexbox;
			  display: flex;
			  flex-wrap: wrap;
			  justify-content: center;
			}
			
			.wrap-login100-form-btn {
			  width: 100%;
			  display: block;
			  position: relative;
			  z-index: 1;
			  border-radius: 25px;
			  overflow: hidden;
			  margin: 0 auto;
			
			  box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
			  -moz-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
			  -webkit-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
			  -o-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
			  -ms-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
			}
			
			.login100-form-bgbtn {
			  position: absolute;
			  z-index: -1;
			  width: 300%;
			  height: 100%;
			  background: #a64bf4;
			  background: -webkit-linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
			  background: -o-linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
			  background: -moz-linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
			  background: linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
			  top: 0;
			  left: -100%;
			
			  -webkit-transition: all 0.4s;
			  -o-transition: all 0.4s;
			  -moz-transition: all 0.4s;
			  transition: all 0.4s;
			}
			
			.login100-form-btn {
			  font-family: 'Microsoft Yahei';
			  font-size: 16px;
			  color: #fff;
			  line-height: 1.2;
			  text-transform: uppercase;
			
			  display: -webkit-box;
			  display: -webkit-flex;
			  display: -moz-box;
			  display: -ms-flexbox;
			  display: flex;
			  justify-content: center;
			  align-items: center;
			  padding: 0 20px;
			  width: 100%;
			  height: 50px;
			}
			
			.wrap-login100-form-btn:hover .login100-form-bgbtn {
			  left: 0;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">发布信息</h1>
		</header>
		<div id="cont">
			<!-- 公司名称 -->
			<div class="mui-input-row">
				<label>公司或个人</label>
				<input type="text" placeholder="公司名称或者个人" name="company_name" id="company_name">
			</div>
			<!-- 姓名 -->
			<div class="mui-input-row">
				<label>姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</label>
				<input type="text" placeholder="姓名" name="linkman" id="linkman">
			</div>
			<!-- 手机 -->
			<div class="mui-input-row">
				<label>手&nbsp;&nbsp;&nbsp;机&nbsp;&nbsp;&nbsp;&nbsp;号</label>
				<input type="tel" placeholder="手机号" name="phone" id="phone">
			</div>
			<!-- 身份 -->
			<div class="mui-input-row">
				<label>身&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;份</label>
				<input type="text" placeholder="甲方写1乙方写2" name="party" id="party">
			</div>
			<!-- 需求详情 -->
			<div class="textarea">
				<label>需求详情</label><br/>
				<textarea rows="6" cols="" id="textarea"></textarea>
			</div>
			<!-- 按钮提交 -->
			<div class="container-login100-form-btn">
				<div class="wrap-login100-form-btn">
					<div class="login100-form-bgbtn"></div>
					<button class="login100-form-btn" id="submit">提 交</button>
				</div>
			</div>
		</div>
		<script src="js/mui.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<script>
			window.onload=function(){
				var submit=mui("#submit");
				submit[0].addEventListener("tap",function(){
					var company_name=mui("#company_name")[0].value;
					var linkman=mui("#linkman")[0].value;
					var phone=mui("#phone")[0].value;
					var party=mui("#party")[0].value;
					var need=mui("#textarea")[0].value;
					
					mui.ajax('http://140.143.206.157:5000/api/v1/company',{
						data:{
							company_name,
							linkman,
							phone,
							party,
							need,
							pass_word:123456
						},
						dataType:'text',//服务器返回json格式数据
						type:'post',//HTTP请求类型
						timeout:10000,//超时时间设置为10秒；
						headers:{'Content-Type':'application/x-www-form-urlencoded'},	              
						success:function(data){
							var data=data.info;
							window.setTimeout(function(){
								var a=mui.toast("发布成功");
								console.log(a)
								window.setTimeout(function(){
									openurl("index.html","index.html")
								},500)
								// 
							},1000)
							
						},
						error:function(xhr,type,errorThrown){
							//异常处理；
							console.log(type);
						}
					});
				},true)
				
			}
			
			
			function openurl(url,idname,id){
				mui.openWindow({
				    url:url,
				    id:idname,
				    styles:{
				      top:0,//新页面顶部位置
				      bottom:"50px",//新页面底部位置
				      width:"100%",//新页面宽度，默认为100%
				      height:"100%"//新页面高度，默认为100%
				      
				    },
				    extras:{
				      // .....//自定义扩展参数，可以用来处理页面间传值
					  id
				    },
				    createNew:false,//是否重复创建同样id的webview，默认为false:不重复创建，直接显示
				    show:{
				      // autoShow:true//页面loaded事件发生后自动显示，默认为true
				      // aniShow:animationType,//页面显示动画，默认为”slide-in-right“；
				      // duration:animationTime//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
				    },
				    waiting:{
				      autoShow:true,//自动显示等待框，默认为true
				      title:'正在加载...',//等待对话框上显示的提示内容
				      options:{
				        width:"100px",//等待框背景区域宽度，默认根据内容自动计算合适宽度
				        height:"60px"//等待框背景区域高度，默认根据内容自动计算合适高度
				        // ......
				      }
				    }
				})
			}
		</script>
	</body>

</html>
